import { Layout, Menu, Icon } from 'antd';
import React from "react"
import './Home.css'
import Consult from '../Consult/Consult'
import Recruitment from '../Recruitment/Recruitment'
import Register from '../Register/Register'
import { Route, Link } from "react-router-dom";
import ConsultEdit from "../ConsultEdit/ConsultEdit"
import RecruitmentEdit from "../RecruitmentEdit/RecruitmentEdit"
import RegisterEdit from "../RegisterEdit/RegisterEdit"
const { Header, Content, Sider } = Layout;
const SubMenu = Menu.SubMenu;

class SiderDemo extends React.Component {
  rootSubmenuKeys = ['sub1', 'sub10', 'sub11'];
  state = {
    openKeys: []
  };

  //点一个下来其他回去
  onOpenChange = (openKeys) => {
    const latestOpenKey = openKeys.find(key => this.state.openKeys.indexOf(key) === -1);
    if (this.rootSubmenuKeys.indexOf(latestOpenKey) === -1) {
      this.setState({ openKeys });
    } else {
      this.setState({
        openKeys: latestOpenKey ? [latestOpenKey] : [],
      });
    }
  }

  render() {
    return (
      <Layout style={{ minHeight: '100vh' }}>
        <Sider
          trigger={null}
          width='256px'
        >
          <div className="logo">122121212121</div>
          <Menu
            openKeys={this.state.openKeys}
            onOpenChange={this.onOpenChange}
            theme="dark" 
            mode="inline"
            defaultSelectedKeys={['1']}
          >
          
            <SubMenu key="sub1" title={<Link to="/"><span><Icon type="mail" /><span>咨询管理</span></span></Link>} style={{textAlign:"left"}}
            >
              <SubMenu key="sub2" title="长仲风采">
                <Menu.Item key="1">关于我们</Menu.Item>
                <Menu.Item key="2">发展历程</Menu.Item>
                <Menu.Item key="3">组织机构</Menu.Item>
                <Menu.Item key="4">委员会成员</Menu.Item>
                <Menu.Item key="5">专门委员会</Menu.Item>
                <Menu.Item key="6">长仲文化</Menu.Item>
                <Menu.Item key="7">仲裁咨询</Menu.Item>
              </SubMenu>
              <SubMenu key="sub3" title="仲裁指南">
                <Menu.Item key="8">当事人仲裁指南</Menu.Item>
                <Menu.Item key="9">仲裁规则</Menu.Item>
                <Menu.Item key="10">仲裁流程</Menu.Item>
                <Menu.Item key="11">仲裁收费</Menu.Item>
                <Menu.Item key="12">文书下载</Menu.Item>
                <Menu.Item key="13">常见问题</Menu.Item>
              </SubMenu>
              <SubMenu key="sub4" title="仲裁员">
                <Menu.Item key="14">仲裁员管理规范</Menu.Item>
                <Menu.Item key="15">服务仲裁员</Menu.Item>
                <Menu.Item key="16">仲裁员风采</Menu.Item>
                <Menu.Item key="17">仲裁员培训</Menu.Item>
              </SubMenu>
              <SubMenu key="sub5" title="在线服务">
                <Menu.Item key="18">在线仲裁指南</Menu.Item>
              </SubMenu>
              <SubMenu key="sub6" title="仲裁鉴定">
                <Menu.Item key="19">鉴定工作管理制度</Menu.Item>
                <Menu.Item key="20">鉴定工作指引</Menu.Item>
              </SubMenu>
              <SubMenu key="sub7" title="仲裁资料">
                <Menu.Item key="21">法律法规</Menu.Item>
                <Menu.Item key="22">案例专栏</Menu.Item>
                <Menu.Item key="23">商事仲裁研究</Menu.Item>
                <Menu.Item key="24">长沙仲裁</Menu.Item>
                <Menu.Item key="25">历史资料</Menu.Item>
              </SubMenu>
              <SubMenu key="sub8" title="分支机构">
                <Menu.Item key="26">金融仲裁院</Menu.Item>
              </SubMenu>
              <SubMenu key="sub9" title="基层党建">
                <Menu.Item key="27">秘书处党支部介绍</Menu.Item>
                <Menu.Item key="28">基层党建工作状态</Menu.Item>
              </SubMenu>
            </SubMenu>
          
            <SubMenu key="sub10" title={<span><Icon type="appstore" /><span><Link to='/Recruitment'>招聘管理</Link></span></span>} style={{textAlign:"left"}}>
            </SubMenu>
          
          
            <SubMenu key="sub11" title={<span><Icon type="setting" /><span><Link to='/Register'>名册管理 </Link></span></span>} style={{textAlign:"left"}}>
              <Menu.Item key="29">仲裁员名册</Menu.Item>
              <Menu.Item key="30">仲裁鉴定机构库</Menu.Item>
            </SubMenu>
        
        </Menu>
        </Sider>
        <Layout style={{textAlign:"left"}}>
          <Header style={{ background: '#fff',padding:"0 24px"}} className="header">
            <div>后台管理系统</div>
            <div><span>退出</span></div>
            <div>某某管理员</div>
          </Header>
          <Content style={{ margin: '24px 16px', padding: 24, background: '#fff', minHeight: 280 }}>
              {/* <ContentPage></ContentPage> */}
                <Route exact path="/" component={Consult} />
                <Route path="/Recruitment" component={Recruitment} />
                <Route path="/Register" component={Register} />
                <Route path="/ConsultEdit" component={ConsultEdit} />
                <Route path="/RecruitmentEdit" component={RecruitmentEdit} />
                <Route path="/RegisterEdit" component={RegisterEdit} />
          </Content>
        </Layout>
      </Layout>
    );
  }
}

export default SiderDemo;